<template>
	<view class="box">
		<view class="tou top" :style="'padding-top:' + statusBarHeight1 + 'px'">
		</view>
		<view class="tou top fixed" :style="'padding-top:' + statusBarHeight1 + 'px'">
			<image @click="fanhui" class="image1" src="https://pic.bangbangtongcheng.com/static/fanhui_bai.png" />
			<!-- #ifndef MP-WEIXIN -->
			礼品详情
			<!-- #endif -->
			<!-- #ifdef MP-WEIXIN -->
			<text @click="fanhui" style="margin-left:75rpx">礼品详情</text>
			<!-- #endif -->
		</view>
		<view class="content">
			<view class="inputBox">
				<view class="clause">
					<!-- <rich-text :nodes="data.content"></rich-text> -->
					<!-- #ifdef MP-WEIXIN -->
					<rich-text :nodes="giftData.giftDetails"></rich-text>
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<p v-html="giftData.giftDetails"></p>
					<!-- #endif -->
				</view>
			</view>
		</view>
		<!-- 去领取 -->
		<view class="" style="height: 150rpx;width: 100%;"></view>
		<view class="goToCollect" v-if="showOpera">
			<template v-if="isX==1">
				<view class="item" style="background-color: #999999;" v-if="whetherReceive>0 || whetherAdvance>0 || whetherOverdue>0 || months==2|| months==3">
					{{whetherReceive>0?'已领取':((whetherAdvance>0|| months==3)?'未生效':'已过期')}}
				</view>
				<view class="item" :style="'background-color:'+(mothChage?'#999999;':' #64B6A8;')" @click="qulq()" v-else>
					去领取
				</view>
			</template>
			<template v-else>
				<view class="item" style="background-color: #999999;" v-if="whetherReceive>0 || giftData.whetherAdvance>0 || giftData.whetherOverdue>0 || months==2|| months==3">
					{{whetherReceive>0?'已领取':(giftData.whetherAdvance>0|| months==3?'未生效':'已过期')}}
				</view>
				<view class="item" :style="'background-color:'+(mothChage||isDisabled==2 || isCanRecord == 0?'#999999;':' #64B6A8;')" @click="qulq()" v-else>
					去领取
				</view>
			</template>
			
		</view>
		<uniBall></uniBall>
	</view>
</template>

<script>
	import {
		mapGetters
	} from "vuex";
	//#ifdef H5
	import wxshare from "../../utils/index.js";
	//#endif
	export default {
		data() {
			return {
				imgUrl: this.$imgSrc,
				id:"",
				giftData:"",
				whetherReceive:0,
				mothChage:false,
				months:0,
				showOpera:false,
				
				isX:0,
				whetherAdvance:0,
				whetherOverdue:0,
				isDisabled:1,
				isCanRecord: ''
			};
		},
		computed: {
			...mapGetters(["statusBarHeight1", "userinfo"])
		},
		onLoad(options) {
			this.license = options.license
			this.id=options.id
			this.months = options.months
			this.isCanRecord = options.isCanRecord
			this.isDisabled = options.isDisabled||1
			if(options.whetherReceive){
				this.whetherReceive=options.whetherReceive
				this.mothChage = options.mothChage
			}
			if(options.isX==1){
				this.isX = options.isX
				this.whetherAdvance = +options.whetherAdvance
				this.whetherOverdue = +options.whetherOverdue
			}
			this.giftDetails()
			/* #ifdef H5 */
			this.jinzhi();
			/* #endif */
		},
		methods: {
			// 获取礼品详情
			giftDetails(){
				this.$myRequest.get("/api/mobile/vehicleOwner/getGiftInformationById",{
					id:this.id
					
				}).then(res => {
					// let date=new Date()
					// 当前时间时间戳
					// let dqTime=date.valueOf()
					// if(res.giftInformation.receiveEndTime.valueOf()>=dqTime){
					// 	res.giftInformation.chage=1
					// }else{
					// 	res.giftInformation.chage=2
					// }
					this.showOpera = true
					this.giftData=res.giftInformation
				});
			},
			qulq(){
				if(this.mothChage){
					uni.showToast({
						title: "该车辆本月已领取会员礼!",
						icon: "none",
						mask: true,
					});
					return
				}
				if(this.isDisabled==2){
					uni.showToast({
						title: "该车辆本月已领取会员礼!",
						icon: "none",
						mask: true,
					});
					return
				}
				if(this.isCanRecord == 0){
					return
				}
				let giftType = this.giftData.giftType
				let giftName = this.giftData.giftName
				uni.navigateTo({
					url: "/pages_owner/carMember/merchantList?id="+this.id+ "&giftType="+giftType+ "&giftName="+giftName +'&license='+this.license
				})
			},
			jinzhi() {
				let _this = this;
				let param = window.location.href.split("#")[0];
				uni.request({
					method: "post",
					data: {
						url: param
					},
					header: {
						"content-type": "application/x-www-form-urlencoded"
					},
					url: "https://www.bangbangtongcheng.com/conven//mob/login/getJsTicket.do",
					success(re) {
						_this.jinzhifx(re.data);
					}
				});
			},
			jinzhifx(data) {
				wxshare.config({
					debug: false, //是否打开调试
					appId: data.appId, // 公众号的唯一标识
					timestamp: data.timestamp, // 生成签名的时间戳
					nonceStr: data.nonce, // ，生成签名的随机串
					signature: data.signature, // 签名
					jsApiList: ["hideMenuItems"]
				});
				// 禁止分享
				wxshare.hideMenuItems({
					// 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
					menuList: [
						"menuItem:share:appMessage",
						"menuItem:share:timeline",
						"menuItem:share:timeline",
						"menuItem:share:qq",
						"menuItem:favorite",
						"menuItem:share:QZone",
						"menuItem:openWithSafari"
					]
				});
			},
			fanhui() {
				uni.navigateBack({
					delta: 1
				});
			},
		}
	};
</script>

<style lang="less" scoped>
	page{
		background-color: #fff;
	}
	.box {
		width: 100%;
		background-color: #fff;
		min-height: 100vh;
	}
	.fixed {
		// display: flex;
		position: fixed !important;
		top: 0;
		left: 0;
		width: 100% !important;
		z-index: 40;
	}
	.goToCollect{
		width: 100%;
		height: 150rpx;
		background-color: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		.item{
			width: 670rpx;
			height: 80rpx;
			background-color: #64B6A8;
			border-radius: 50rpx;
			font-size: 34rpx;
			font-weight: 400;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
	.tou {
		position: relative;
		width: 100%;
		// height: 88rpx;
		text-align: center;
		/* #ifdef MP-WEIXIN */
		text-align: left;
		display: flex;
		align-items: center;
		/* #endif */
		line-height: 88rpx;
		font-size: 36rpx;
		color: #fff;
		background-color: #64b6a8;

		.image1 {
			position: absolute;
			width: 32rpx;
			height: 32rpx;
			// top: 116rpx;
			left: 30rpx;
		}

		.image2 {
			position: absolute;
			width: 56rpx;
			height: 56rpx;
			bottom: 16rpx !important;
			// top: 116rpx;
			right: 30rpx;
			/* #ifdef MP-WEIXIN */
			position: initial;
			margin-left: auto;
			margin-right: 200rpx;
			/* #endif */
		}
	}
	.content {
		padding: 0 30rpx;
		padding-top: 40rpx;
		/* #ifdef MP */
		// height: calc(100vh - 192rpx);
		/* #endif */
		/* #ifdef APP-PLUS || H5 */
		// height: calc(100vh - var(--status-bar-height) - 192rpx);
	
		/* #endif */
		.input {
			width: 690rpx;
			padding: 0 24rpx;
			margin: 0 auto;
			height: 90rpx;
			border: 1rpx solid #e0e0e0;
			font-size: 30rpx;
	
			input {
				width: 100%;
				height: 100%;
			}
		}
	}
</style>
